<template>
        <div style="margin: 30px;">
            <!-- <el-button type="primary" size="medium" @click="returnOver">返回</el-button> -->
           <div style="margin: 30px 0">
                
                <el-form :inline="true" :model="queryData">
                    <el-form-item label="创建时间：">
                                <el-date-picker
                                value-format="yyyy-MM-dd HH:mm:ss"
                                v-model="endtime"
                                type="datetimerange"
                                range-separator="至"
                                start-placeholder="开始日期"
                                end-placeholder="结束日期"
                                @change="changeTime">
                        </el-date-picker>
                     </el-form-item>
                     <el-form-item label="单据编号：">
                        <el-input style="width: 300px;" v-model="queryData.moveNo" placeholder="请输入单据编号" size="medium"></el-input>
                            
                    </el-form-item>
                    <!-- <el-form-item label="调出位置">
                        <el-select v-model="queryData.outstore" size="medium" >
                            <el-option :value="item.id" :label="item.storeName" v-for="item in selectedOptions" :key="item.index"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="调入位置">
                        <el-select v-model="queryData.storeId" size="medium" @change="handleChange">
                            <el-option :value="item.id" :label="item.storeName" v-for="item in selectedOptions" :key="item.index"></el-option>
                        </el-select>
                        <el-select v-model="inputAreaId" size="medium" @change="handleChangetype">
                            <el-option :value="item.id" :label="item.areaName" v-for="item in deptData" :key="item.index"></el-option>
                        </el-select>
                    </el-form-item> -->
                   
                    <el-form-item label="" style="margin-left:50px">
                        <el-button type="primary" size="medium" @click="queryAllcat">查询</el-button>
                        <el-button type="warning" size="medium" @click="Allcatrecord(queryData)">重置</el-button>
                    </el-form-item>
                    <el-form-item label="" style="margin-left:50px">
                        <el-button type="primary" size="medium" @click="newbuild">新建调拨</el-button>
                       
                    </el-form-item>
                </el-form>
                <!-- <el-form :inline="true">
                        <el-form-item label="">
                            <el-input v-model="goodsId" autofocus @keyup.enter.native="smentry"  style="width:250px" placeholder="请录入商品ID"></el-input>
                        </el-form-item>
                        <el-form-item label="">
                            <el-button type="primary" size="medium" @click="smentry()">确定录入</el-button>
                        </el-form-item>
                </el-form> -->
    
        </div>
        <div class="wrapper">
                <el-table class="table" :data="tableData" stripe highlight-current-row border>
                 <el-table-column
                    type="index"
                    width="50">
                  </el-table-column>
                  <!-- <el-table-column align="center" type="selection">
                    </el-table-column> -->
                  <el-table-column align="center" prop="addTime" label="创建时间">
                  </el-table-column>
                  <el-table-column align="center" prop="goodsId" label="商品id">
                    </el-table-column>
                  <el-table-column align="center" prop="moveNo" label="单据编号">
                  </el-table-column>
                  </el-table-column>
                  <el-table-column align="center" prop="ageName" label="调出位置">
                  </el-table-column>
                  <el-table-column align="center" prop="nowName" label="调入位置">
                  </el-table-column>
                  <el-table-column align="center" prop="username" label="制单人">
                  </el-table-column>
                 
                  <el-table-column align="center" prop="description" label="明细备注">
                  </el-table-column>
                  
                </el-table>
                <!-- <el-pagination background layout="total,prev, pager, next,jumper" :page-size="page.pageSize" :total="page.total" :current-page="page.current"
                  @current-change="handleCurrentChange">
                </el-pagination> -->
                <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="page.current"
                :page-sizes="[10,20,30]"
                :page-size="page.pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="page.total">
              </el-pagination>
              </div>
              <audio id="myaudio" src="../../../viode/004.mp3" controls="controls" hidden="hidden" ></audio>
              <audio id="warn" src="../../../viode/warn.mp3" controls="controls"  hidden="hidden"></audio>
        </div>
    </template>
    <script>
            export default{
                data(){
                    return{
                       
                        inputAreaId:'',
                        selectedOptions:[],
                        deptData:[],
                        inType:'',
                        unusedNum:'',
                        page: {
                            pageSize: 10,
                            current: 1,
                            total: null
                        },
                        tableData:[],
                       
                        endtime:'',
                        queryData: {
                            startTime:'',
                            endTime:'',
                            moveNo:'',
                            outstore:'',
                            storeId:'',
                           
                            
                        },
                    }
                },
                mounted () {
                    this.area();
                    this.inintable();
                },
                methods: {
                    //货位
                    handleChangetype(id){
                        // this.numinfo(id)
                       
                    },
                    //仓库
                    handleChange(id){
                        this.inputAreaId = '';
                        this.areainfo(id)
                       
                    },
                    //查询
                    queryAllcat(){
                       this.inintable();
                    },
                    //新建
                    newbuild(){
                        this.$router.push({path:'/cellCation'})
                    },
                    //重置
                    Allcatrecord(formName){
                        // console.log(formName)
                    formName.endTime = '';
                    formName.startTime = '';
                      formName.outstore = ''
                       formName.storeId = ''
                      formName.moveNo = '';
                      this.endtime = '';
                    },
                    //页码
                    handleSizeChange(value){
                        this.page.pageSize = value;
                        this.inintable();
                    },
                    handleCurrentChange(value){
                        this.page.current = value;
                        this.inintable();
                    },
                    
                    changeTime(arr){
                        console.log(arr)
                        if(arr != null){
                            this.queryData.startTime = arr[0];
                            this.queryData.endTime = arr[1];
                        }else{
                            this.queryData.startTime = '';
                            this.queryData.endTime = '';
                        }
                    },
                   
                    async inintable(){
                       
                        try{
                            let {data} = await this.$post({
                                api:'/cellarGoodsMoving/show/allMoveCellarGoods',
                                data:{
                                    current:this.page.current,
                                    pageSize:this.page.pageSize,
                                    moveStatus:1,
                                    startTime:this.queryData.startTime,
                                    endTime:this.queryData.endTime,
                                    moveNo:this.queryData.moveNo
                                }
                            })
                            if(data.code === 0){
                                this.tableData = data.data;
                                this.page.total = data.rdPage.total;
                                console.log(data)
                            }
                        }catch(error){
    
                        }
                    },
                    
                    //仓库
                    async area() {
                    
                    try {
                     
                      let { data } = await this.$post({
                        api: "/show/store/area"
                        
                      });
                      
                      if (data.code === 0) {
                        this.selectedOptions = data.data;
                     
                      } else {
                        this.$message({
                          type: "error",
                          message: data.msg
                        });
                      }
                    } catch (e) {
                      // this.$message({
                      //   type: "error",
                      //   message: "接口报错"
                      // });
                    }
                  },
                  //根据仓库id货位
               async areainfo(id) {
                  try {
                    let { data } = await this.$post({
                      api: "/show/store/areainfo",
                      data:{
                        storeId:id
                      }
                    });
                    if (data.code === 0) {
                      
                      this.deptData = data.data;
                      // this.inType = data.data[0].areaType;
                      // this.unusedNum = data.data[0].unusedNum;
                    console.log(data)
                    } else {
                      this.$message({
                        type: "error",
                        message: data.msg
                      });
                    }
                  } catch (e) {
                    // this.$message({
                    //   type: "error",
                    //   message: "接口报错"
                    // });
                  }
               },
                  returnOver(){
                      this.$router.go(-1);
                  }
                   
                   
                }
            }
        </script>